<template>
	
		<view class="con-box" :class="bgpos?'isAndoids':''" :style="{
			backgroundImage:'url('+pageList[113].icon_url+')'
		}">
			<!-- 背景图片区域 -->
			<!-- <image :src="pageList[113].icon_url" class='image-bg'></image> -->
			<!-- 顶部状态栏的显示 :class="getTheme + '-m-back ' + getTheme"-->
			<view class="top-navbox" :class="bgpos?'isAndoidsBg':'' ":style="{height:navHeight+'px',backgroundImage:'url('+pageList[115].icon_url+')'}" >
				<view class="dir-left-nowrap cross-center top-nav"
					:style="{ width: navwidth + 'px', marginTop: navinputTop + 'px',height:navimgHeight+'px',padding:'0 16rpx' }">
					<swiper class="suiji" vertical circular :autoplay="true" :interval="3000" :duration="1000">
						<swiper-item class="suiji" v-for="(item,index) in pageList[51].subnav" :key="index">
							<view class="suiji">
								<image :src="item.icon_url" mode="heightFix" style="max-width: 64rpx;"></image>
							</view>
						</swiper-item>
					</swiper>
				</view>
				<view class="page-width" :class="bgpos?'isAndoidsMargin':''">
					<view class="navbox-bind dir-left-nowrap cross-center" v-if="bind_info" @click="toBindUser">
						<image class="imgag" :src="bind_info.avatar" style="max-width: 64rpx; max-height: 64rpx;" mode="heightFix"></image>
						<text class="u-line-1" style="flex: 1;">{{bind_info.nickname}}</text>
					</view>
					<view class="app-view">
						<view class="jump dir-left-nowrap main-center cross-center"
							@click="jump('/plugins/mch_solitaire/search/search')">
							<view class="input main-center">
								<view class="app-text-search dir-left-nowrap cross-center">
									<view class="search-left">
										<view class="app-icon u-iconfont">&#xe600;</view>
										<text class="text">点击搜索商品名称</text>
									</view>
									<view class="search-right">
										<text>搜索</text>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			
			</view>
			<!-- 搜索框 -->
			<view class="navbox-content" :style="{'margin-top': navHeight+'px'}" >
				
				<!-- 横向选项卡 -->
				<view class="horizonal-tab">
					<scroll-view scroll-x="true" scroll-with-animation class="scroll-tab">
						<block v-for="(item,index) in pageList[102].subnav" :key="index">
							<view class="scroll-tab-item" :class="{'active': tabIndex==index}" @click="toggleTab(item)">
								<view class="tab-center">
									<text>{{item.name}}</text>
									<view class="scroll-tab-line"></view>
								</view>
							</view>
						</block>
					</scroll-view>
				</view>
				<!-- 第一个轮播图区域 -->
				<view class="mch-banner" v-if="pageList[2].subnav.length > 0"
					style="margin: 0rpx auto 32rpx;padding: 0 20rpx;">
					<app-swiper :list="pageList[2].subnav" name="icon_url" :height="300" :autoplay="true"
						:borderRadius='16'>
					</app-swiper>
					<view class="rota">
						<swiper style="height: 72rpx;" :autoplay="true" :interval="3000" :duration="1000"
							:circular="true" :vertical="true">
							<swiper-item v-for="(item,index) in avaterimg" :key="index" style="width: 710rpx;">
								<view class="swiper-item cross-center">
									<image class="imgag" :src="item.useravatar" mode=""></image>
									{{ item.username }}
								</view>
							</swiper-item>
						</swiper>
					</view>
				</view>
				<!-- 列表区 topMargin:{
				type:String,
				default(){
					return '0';
				}
			}, -->
				<view class="" style="padding: 0 20rpx;">
					<app-navigation-icon v-if="pageList[3].subnav.length > 0" navHeight="152"  navMargin="20rpx auto"
						iconRadius="50%" :imgStyle="imgstyle1" :navs="pageList[3].subnav" background="#ffffff"
						:scroll="true" columns="5" :rows="2" :borderRadius='16' :marginTop='String(this.topmargin)'
						:isShow="true" :isShow2="false" :navPaddinngTop="4" :autoplay='false' itembackground="#ffffff">
					</app-navigation-icon>
				</view>
				<view class="" style="width: 100%; height: 12rpx;">

				</view>
				<!-- 导航区 10月26日修改注销 nextMargin="108rpx"  -->
				<view class="" style="padding: 0 20rpx;">
					<!--<app-navigation-icon :autoplay="false" v-if="pageList[4].subnav.length > 0" navHeight="256"
					navMargin="20rpx auto" :navs="pageList[4].subnav" background="#f7f7f7" :scroll="true" :columns="2"
					:imgStyle="imgstyle" :rows="1" >
					
				</app-navigation-icon>-->
					<app-swiper :list="pageList[61].subnav" borderRadius="0" name="icon_url" :height="220"
						:autoplay="true" :borderRadius='16'>
					</app-swiper>
				</view>

			</view>
			<!-- 新增 领券区域-->
			<view class="lingq-center" @click="goPage(pageList[62])">
				<image :src="pageList[62].icon_url" mode="scaleToFill" ></image>
			</view>
			<!-- 新增  今日秒杀区域 :seckillImgArr='seckillArr' :borderRadius='16' :seckillPrice='[35,35]' :bgPriceColor='priceColor1' -->
			<view class="seckill" style="padding: 0 20rpx;">
				<appSeckill :seckillImgArr='pageList[63].subnav' :borderRadius='16' :bgPriceColor='priceColor1'>
				</appSeckill>
				<!-- 排行榜区域 -->
				<appSeckill :seckillImgArr='pageList[72].subnav' :borderRadius='16' :showTopImage="false"
					:seckillFont="['排行榜','跟榜购好物']"></appSeckill>
			</view>

			<view class="wallerSeckill" style="padding: 0 20rpx;">
				<!-- 新增竖屏轮播图 -->
				<view class="" style="width: 49%;">
					<app-swiper :list="pageList[79].subnav" borderRadius="0" name="icon_url" :height="512"
						:autoplay="true" :borderRadius='16'>
					</app-swiper>
					<view class="" style="margin-top: 24rpx;">
						<appSeckill :seckillImgArr='pageList[82].subnav' :showTopImage='false'
							:seckillFont="['今日必买','尽享三折优惠']" :borderRadius='16' :bgPriceColor='priceColor2' :showTextBg='true'> 
						</appSeckill>

					</view>

				</view>
				<!-- 轮播图左侧秒杀组件 -->
				<view class="" style="margin-left: 7px;display: flex;flex-direction: column;align-items: center;">
					<appSeckill :seckillImgArr='pageList[75].subnav' :showCenterImage='true' :showTopImage='false'
						:seckillFont="['今日特惠','爆款轮番秒']" :borderRadius='16'></appSeckill>
					<view class="">
						<!-- 固定商品 -->
						<view class="fixedgoods">
							<u-indexware :value="pageList[126].subnav"></u-indexware>
							<!-- <view class="fixedgoods-img">						
					</view> -->

						</view>
					</view>
				</view>

			</view>

			<!-- 推荐区 -->
			<view class="" style="margin: 0 auto 32rpx; padding: 0 0 0 0 4rpx ;">
				<u-indexware :value="pageList[5].subnav"></u-indexware>
				<!-- <u-goods-ware :value="blendList" @routego="routeGo"></u-goods-ware> -->
			</view>
			<view class="" :style="{height:BotHeight + 'rpx'}"></view>
			<!-- <view class="">
			<sol-tab-bar router="/plugins/mch_solitaire/index/index"></sol-tab-bar>
		</view> -->
		</view>
</template>

<script>
	import {
		mapState,
		mapGetters
	} from "vuex";
	import appSeckill from "../../components/basic-component/app-seckill/app-seckill.vue"
	// import solTabBar from '../../plugins/mch_solitaire/components/sol-tab-bar.vue'
	import appSwiper from '../../components/page-component/app-swiper/app-swiper.vue';
	import appNavigationIcon from '../../components/page-component/app-navigation-icon/app-navigation-icon.vue';
	import uIndexware from '../../components/page-component/u-goods-list/u-indexware.vue';
	// import uGoodsWare from '../../../components/page-component/u-goods-list/u-goods-ware.vue';
	export default {
		components: {
			appSwiper,
			appNavigationIcon,
			// solTabBar,
			uIndexware,
			appSeckill
			// uGoodsWare
		},
		onShareAppMessage() {

		},
		onReady() {
			let obj = {};
			obj = wx.getMenuButtonBoundingClientRect();
			wx.getSystemInfo({
				success: res => {
					this.navwidth = obj.left || res.windowWidth;
					//导航高度
					this.navHeight = obj.top ? obj.top + obj.height + 50 : res.statusBarHeight + 44;
					this.navimgHeight = obj.height || res.statusBarHeight;
					this.navinputTop = obj.top ? obj.top + (obj.height - 32) / 2 : res.statusBarHeight + 7
				},
				fail(err) {
					console.log(err);
				}
			})
		},
		data() {
			return {
				show: true,
				isCard: false,
				isloginmch: false,
				mchid: 0,
				pageList: [],
				blendList: [],
				page: 1,
				page_count: 1,
				imgstyle: "width: 336rpx;height: 210rpx",
				imgstyle1: "width: 86rpx;height: 86rpx",
				avaterimg: [],

				getTheme: 'q',
				navwidth: '',
				navinputTop: '',
				navimgHeight: '',
				navHeight: 88,

				bind_lauser_id: 0, // 用户接龙主页用户id
				bind_mch_id: 0, // 接龙商户id
				bind_info: '',
				navVal: [{
						id: 0,
						name: '首页',
					},
					{
						id: 1,
						name: '今日爆款'
					},
					{
						id: 2,
						name: '百亿补贴'
					},
					{
						id: 3,
						name: '群主爆款'
					},
					{
						id: 4,
						name: '金币商城'
					},
					{
						id: 5,
						name: '抵用券'
					},
					{
						id: 6,
						name: '抵用券'
					},
					{
						id: 7,
						name: '抵用券'
					},
				],
				tabIndex: 0,
				topmargin: '24rpx 0 0 0',
				// 界面秒杀数组

				priceColor1: "#EA686B",
				priceColor2: "#F7992B ",
				bgpos:false,

			}
		},
		computed: {
			...mapState({
				userInfo: state => state.user.info
			}),
			...mapGetters('iPhoneX', {
				botNavHei: 'getNavHei',
				BotHeight: 'getBotHeight',
			})
		},
		onShow() {
			const self = this;
		
			/* const mch = uni.getStorageSync('MCHsxt');
			if (!mch) {
				uni.redirectTo({
					url: '/plugins/mch_solitaire/mch/login/login',
				})
				return;
			}
			self.mch_id = mch.mch.id;
			uni.getStorage({
				key: 'MCHsxt',
				success: res => {
					self.isloginmch = true
					self.mchid = res.data.mch.id
					console.log(res, 'res');
				},
				fail: err => {
					self.isloginmch = false
					console.log(err, 'err');
				}
			})
			self.$showLoading({
				title: '登陆中'
			});
			self.$request({
				url: self.$apiSol.mch.manage_index,
				data: {
					mch_id: self.mch_id
				}
			}).then(info => {
				self.$hideLoading();
				if (info.code === 0) {
					const detail = info.data.detail;
					if (detail.status === '0') {
						uni.showModal({
							title: '提示',
							content: '店铺已被关闭！请联系管理员',
							showCancel: false,
							success: function(e) {
								if (e.confirm) {
									uni.redirectTo({
										url: '/plugins/mch_solitaire/mch/login/login',
									})
								}
							}
						});
					}
					self.detail = detail;
				} else {
					uni.redirectTo({
						url: '/plugins/mch_solitaire/mch/login/login',
					})
				}
			}); */
			self.navsReq()
		},
		onLoad(options) {
			
			const self = this;
			self.initrequest()
			self.storeupdown()
			self.getInfo()	
			console.log(options, '首页options');
			if (options.targoodsid) {
				self.targoodsid = options.targoodsid
			}
			if (options.useridres) {
				self.useridres = options.useridres
			}
			if (options.mallid) {
				self.mallid = options.mallid
			}
			// 获取个人中心的数据
			self.$nextTick().then(() => {
				self.$store.dispatch('userCenter/data');
			});
			// 假拼团 11.01
			if (options.useridshgold) {
				self.useridshgold = options.useridshgold
			}
			// console.log(options, 123456);
			// console.log(self);
			// 8.30 新加 （如果有 就请求，没有就不请求）
			if (options.q) {
				uni.request({
					url: decodeURIComponent(options.q),
					header: {
						'X-Access-Token': self.$store.state.user.accessToken
					}
				})
			}
			// self.imgprefix = self.$siteInfo.imgroot
			// 测试下分支
			// console.log(options);
			if (typeof options.scene !== 'undefined') {
				if (options.scene === 'share') {
					self.share(options);
				} else {
					self.qrcode(options);
				}
			} else {
				// self.$showLoading();
			}

			if (typeof options.user_id !== 'undefined') {
				self.$store.dispatch('user/setTempParentId', options.user_id);
			}
			const afff =uni.getSystemInfoSync().platform
			// console.log("appppppppp",afff);
			if(afff !== "ios"){
				self.bgpos = true
			}else{
				return
			}
			self.page_id = typeof options.page_id !== 'undefined' ? Number(options.page_id) : 0;


				
		},
		methods: {
			// 实体店界面
			goPage(item){
				// console.log(item);
				uni.navigateTo({
					url:item.url
				})
			},

			share(options) {
				console.log(options, 'share');
				if (typeof options.params !== 'undefined') {
					console.log(options.params, 'options.params !== ');
					let params = JSON.parse(options.params);
					console.log(params, 'options.params');
					this.$jump({
						url: params.path + '?' + this.$utils.objectToUrlParams(params),
						open_type: 'navigate'
					});
				}
			},
			qrcode(options, curl) {
				let url = this.$api.default.qrcode_parameter
				if (curl) {
					url = this.$apiSol.default.qrcode_parameter
				}
				// if (options.scene.indexOf('qjl') != -1) {
				// 	url = this.$apiSol.default.qrcode_parameter
				// }
				if (options.scene.slice(0, 3) == 'qjl') {
					url = this.$apiSol.default.qrcode_parameter
				}

				console.log(options, curl);
				this.$request({
					url: url,
					data: {
						token: options.scene
					}
				}).then(response => {
					if (response.code === 0) {
						/* if (response.data.detail == null) {
							url = this.$apiSol.default.qrcode_parameter
							this.qrcode(options, url)
							return
						} */
						this.$store.dispatch('page/actionSetQeury', null);
						let {
							data,
							path
						} = response.data.detail;
						let url = path == 'plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin' ?
							`${path}` : `/${path}`;
						if (data) {
							url += '?' + this.$utils.objectToUrlParams(data);
							if (typeof data.user_id !== 'undefined') {
								this.$store.dispatch('user/setTempParentId', data.user_id)
							}
						}
						if (`/${path}` != '/pages/index/index' || (typeof data.page_id !== 'undefined' && data
								.page_id !== this.homePages.id !== 0)) {
							this.$jump({
								url: url,
								open_type: 'navigate'
							});
						}
					}
				}).catch(() => {});
			},




			// 横向导航条点击
			toggleTab(item) {
				console.log(item);
				this.tabIndex = item.id
				uni.navigateTo({
					url: item.url
				})
			},
			async getInfo() {
				let self = this
				const res = await self.$request({
					url: self.$apiSol.user.user_info,
					method: 'get',
				})
				// console.log(res);
				if (res.code == 0) {
					// self.bind_lauser_id = res.data.mchuser.id
					// self.bind_mch_id = res.data.mchuser.mch_id
					// self.bind_info = res.data.mchuser
					self.bind_info = res.data.bingUserInfo
					self.bind_lauser_id = res.data.bingUserInfo.user_id
					self.bind_mch_id = res.data.bingUserInfo.mch_id
				}
			},
			toBindUser() {
				// console.log(this.bind_mch_id);
				uni.navigateTo({
					url: '/plugins/mch_solitaire/solist/solist?lauser_id=' + this.bind_lauser_id + '&mch_id=' +
						this.bind_mch_id
				})
			},
			storeupdown() {
				this.$request({
					url: this.$api.apply.list,
					data: {
						page: 1,
						limit: 5,
						review_status: 1,
						keyword: 'random'
					}
				}).then((res) => {
					this.avaterimg = res.data.list
				}).catch(err => {
					// console.log(err);
				})
			},
			async initrequest() {
				this.$showLoading();
				const res = await this.$request({
					url: this.$apiSol.default.goods_list,
					method: 'get',
					data: {
						page: this.page,
						is_sales: 1
					}
				});
				if (res.code === 0) {
					this.$hideLoading();
					this.page_count = res.data.pagination.page_count;
					// this.total_count = res.data.pagination.total_count;
					this.blendList = this.blendList.concat(res.data.list)
					uni.stopPullDownRefresh()
				} else {
					this.$hideLoading();
					uni.showModal({
						title: '提示',
						content: res.msg,
					})
				}
			},
			navsReq() {
				this.$showLoading();
				this.$request({
					url: this.$apiSol.navs.index,
					data: {
						id: 1
					}
				}).then((res) => {
					this.$hideLoading();
					if (res.code === 0) {
						this.pageList = res.data.list
						console.log(this.pageList);
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				}).catch(() => {
					this.$hideLoading();
				})
			},
			jump(url) {
				let aurl = url
				if (aurl.indexOf('?') == -1) {
					aurl = aurl + '?mch_id=' + this.mchid
				} else {
					aurl = aurl + '&mch_id=' + this.mchid
				}
				uni.navigateTo({
					url: aurl
				})
			},
			solit(item) {
				uni.navigateTo({
					url: '/plugins/mch_solitaire/solitaire/solitaire'
				})
			},
			tososet() {
				uni.navigateTo({
					// url: '/plugins/solitaire/setting/setting' + '?mch_id=' + this.mchid
					url: '/plugins/mch_solitaire/mch/config/config' + '?mch_id=' + this.mchid
				})
			},
			tomchlogin() {
				uni.navigateTo({
					url: '/plugins/mch_solitaire/mch/login/login'
				})
			},
			tomchlogout() {
				uni.removeStorage({
					key: 'MCHsxt'
				});
				this.isloginmch = false
				this.mchid = 0
			}
		}
	}
</script>

<style scoped lang="scss">
	.top-navbox {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		// padding: 12px 0 0 24rpx;
		// background-color: #fff;
		z-index: 1001;
		background-repeat: no-repeat;
		background-size: 100%;
		background-position-y: -10rpx ;
		color: #FFFFFF00;

		.top-nav {
			font-size: 28rpx;

			.back-img {
				width: 18rpx;
				height: 32rpx;

				// .imhg {
				// 	width: 36rpx;
				// 	height: 36rpx;
				// }
			}

			>.nav-text {
				margin-left: 24rpx;
			}
		}

		.suiji {
			width: 100%;
			height: 100%;
			text-align: left;

			image {
				// width: 100%;
				height: 100%;
			}
		}
	}

	.navbox-content {
		position: relative;

		&::before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 260rpx;
			background-color: #09ba0700;
			border-radius: 0 0 50% 50%;
		}
			
				.navbox-bind {
					z-index: 1;
					margin: 0 16rpx;
					color: #000000;
					font-size: 28rpx;
					max-width: 240rpx;
					// padding-bottom: 16rpx;
					.imgag {
						width: 56rpx;
						height: 56rpx;
						border-radius: 50%;
						margin-right: 8rpx;
					}
				}
			
					
	}

	.mch-banner {
		position: relative;

		.rota {
			position: absolute;
			top: 24rpx;
			left: 24rpx;
			width: 214rpx;
			height: 72rpx;
			z-index: 0;
			background: rgba(0, 0, 0, 0.5);
			font-size: 24rpx;
			line-height: 72rpx;
			text-align: center;
			border-radius: 50rpx;
			box-shadow: 0 1rpx 3rpx rgba(0, 0, 0, 0.2);
			padding: 0 12rpx;

			// opacity: .6;
			color: #FFFFFF;

			.imgag {
				width: 48rpx;
				height: 48rpx;
				border-radius: 50rpx;
				margin: 0 12rpx;
			}
		}
	}

	.model {
		background-color: #c7b47a;
		color: #FFFFFF;
		padding: 36rpx;
		width: 702rpx;
		border-radius: 14rpx;
		// text-align: center;
	}

	.page-width {
		display: flex;
		align-items: center;
		justify-content: space-around;
		margin-top: 8rpx;
		.navbox-bind {
			z-index: 1;
			margin: 0 16rpx;
			color: #000000;
			font-size: 28rpx;
			max-width: 240rpx;
		padding-bottom: 16rpx;
			.imgag {
				width: 56rpx;
				height: 56rpx;
				border-radius: 50%;
				margin-right: 8rpx;
			}
		}
	}

	.app-view {
		height: #{88rpx};
		// width: #{704rpx};
		width: 100%;
		flex: 1;
		margin: 0 16rpx;
		position: relative;
		border: none;
	}

	.jump {
		width: 100%;
		height: 100%;
		padding-bottom: 16rpx;
	}

	.input {
		// height: #{58rpx};
		flex: 1;
	}

	.app-text-search {
		z-index: 1000;
		width: #{100%};
		height: #{72rpx};
		line-height: #{58rpx};
		background-color: #f7f7f7;
		border-radius: 36rpx;
		border: 1px solid #DB4335;
		color: #c0c0c0;
		box-shadow: 0 0 4rpx rgba(0, 0, 0, 0.1);
		display: flex;
		justify-content: space-between;
		align-items: center;
		
		.search-left {
			display: flex;
			align-items: center;

			.text {
				font-size: #{26rpx};
			}
		}

		.search-right {
			width: #{126rpx};
			height: #{60rpx};
			background: linear-gradient(90deg, #E4432E 0%, #E83F2E 100%);
			;
			border-radius: 32rpx;
			text-align: center;
			color: white;
			font-size: #{28rpx};
			margin-right: #{4rpx};
		}
	}



	.app-icon {
		margin-right: #{12rpx};
		margin-left: #{12rpx};
		width: #{25rpx};
		height: #{25rpx};
		font-size: 28upx;
	}

	.con-box {
		width: 100%;
		overflow-x: hidden;
		// padding: 0 24rpx;
		background-repeat: no-repeat;
		background-size: 100%;
		background-position-y: -10rpx ;
		.image-bg{
			top:-60rpx;
		}
	}

	.con-info {
		padding: 24rpx;

		.info-inner {
			border-radius: 16rpx;
			background: #FFFFFF;
			padding: 24rpx;
			display: flex;
			align-items: center;

			.info-avatar {
				width: 150rpx;
				height: 150rpx;
				border-radius: 50%;
				border: 6rpx solid #f9f9f9;

				image {
					width: 100%;
					height: 100%;
					border-radius: 50%;
				}
			}
			.info-some {
				margin-left: 32rpx;

				.info-name {
					font-size: 32rpx;
					font-weight: 700;
				}

				.info-set {
					margin-top: 6rpx;
					font-size: 24rpx;
					color: #888888;
				}
			}
		}
	}

	.all-box {
		// width: 702rpx;
		// margin: 0 auto;
		width: 100%;
		padding: 24rpx;
		background-color: #FFFFFF;
		font-size: 28rpx;
		line-height: 80rpx;
		text-align: center;

		.cla-item {
			padding: 0 24rpx;
		}
	}

	.rea-btn {
		text-align: center;
		line-height: 80rpx;
		color: #FFFFFF;
		background-color: #09ba07;
		border-radius: 72rpx;
		margin: 24rpx auto;
	}

	.launch-so {
		// padding: 0 24rpx;
		width: 702rpx;
	}

	.reatime {
		margin-top: 30rpx;
		margin-left: 24rpx;
		display: flex;
		position: relative;
		align-items: center;
		min-height: 100rpx;

		.text-orange {
			display: inline-block;
			background: #f37b1d;
			width: 8rpx;
			height: 28rpx;
		}

		.action {
			margin-left: 30rpx;
			font-size: 30rpx;
			margin-right: 30rpx;
		}
	}

	.rea-solitaire {
		padding: 24rpx;

		.rea-soitem {
			border-radius: 16rpx;
			background: #FFFFFF;
			padding: 24rpx;
		}

		.rea-content {
			font-size: 28rpx;

			.b-image {
				width: 100%;
				height: 200rpx;
			}
		}

		.rea-btn {
			text-align: center;
			line-height: 80rpx;
			color: #FFFFFF;
			background-color: #09ba07;
			border-radius: 72rpx;
			margin: 24rpx auto;
		}

		.publisher {
			display: flex;
			padding-right: 10rpx;
			height: 140rpx;
			background-color: #ffffff;
			align-items: center;

			.avatar {
				width: 96rpx;
				height: 96rpx;
				border-radius: 50%;
			}

			.content {
				width: calc(100% - 96rpx - 60rpx - 20rpx);
				font-size: 26rpx;
			}

			.create-time {
				font-size: 24rpx;
				color: #aaaaaa;
			}
		}
	}

	.solitaireor {
		font-size: 28rpx;

		.so-item {
			display: flex;
			align-items: center;

			.so-avatar {
				width: 64rpx;
				height: 64rpx;
				border-radius: 50%;
			}

			.so-content {
				font-size: 24rpx;
				display: flex;
				justify-content: space-between;
				flex: 1;
			}
		}
	}

	.soli-else {
		font-size: 28rpx;
		color: #888888;
		text-align: center;
		line-height: 60rpx;
	}

	// 领券区域
	.lingq-center {
		width: 100%;
		height: 100rpx;
		padding: 0 20rpx;
		margin: 32rpx 0;		
		image {
			width: 710rpx;
			height: 100%;
			border-radius: 16rpx;
		}
	}

	// 秒杀区域
	.seckill {
		display: flex;
		justify-content: space-between;
	}

	// 瀑布流+秒杀
	.wallerSeckill {
		padding: 0 12rpx;
		display: flex;
		margin-top: 18rpx;
		justify-content: space-between;
	}

	// 固定商品的展示区域
	.fixedgoods {
		width: 100%;

		.fixedgoods-img {
			width: 350rpx;
			height: 450rpx;

			image {
				height: 60%;
				width: 100%
			}
		}
	}

	// 横向导航条
	.horizonal-tab {
		height: 62rpx;

	}

	.scroll-tab {
		height: 100%;
		white-space: nowrap;
		/* 必要，导航栏才能横向*/
		text-align: center;
		margin-top: 12rpx;
	}

	.scroll-tab-item {
		height: 100%;
		display: inline-table;
		/* 必要，导航栏才能横向*/
		margin: 0rpx 18rpx 0 18rpx;
		font-size: 26rpx;
	}

	.horizonal-tab .active {
		color: #F43E3A;
		font-size: 28rpx;
		font-weight: 600;

	}

	.tab-center {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.active .scroll-tab-line {
		position: absolute;
		margin: 0 auto;
		top: 22rpx;
		width: 36rpx;
		height: 36rpx;
		border: 6rpx solid #F43E3A;
		border-radius: 100rpx;
		-webkit-clip-path: polygon(100% 60%, 100% 0%, 100% 3600%, 0% 60%);
	}
	.isAndoids{
		background-position-y: -26rpx;
	}
	.isAndoidsMargin{
		margin-top:16rpx;
	}
	.isAndoidsBg{
		background-position-y: -26rpx;
	}
</style>
